<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>回收站</title>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/style.css"/>
    <!--Layui-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--extended-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/extended.css"/>
    <!--公用样式JS-->
    <script type="text/javascript" src="${re.contextPath}/plugin/jquery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/comment.js"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.js" charset="utf-8"></script>
    <style>
        .project>div>a:nth-child(1){
            margin-left: 0;
        }
        .layui-laypage-limits{
            width: 120px;
        }
    </style>
</head>
<body>
<div class="project whitebg">
    <div class="clearfix">
        <a href="#" class="fl white ft14 " onclick="delAll()">删除全部</a>
        <a href="#" class="fl white ft14 btn_del" onclick="batchDel()">批量删除</a>
    </div>
    <div>
        <table id="projectList" style="height: 400px;" class="layui-hide" lay-filter="project"></table>
    </div>
</div>

<script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
<script type="text/html" id="toolBar">
    <a class="layui-btn layui-btn-xs  layui-btn-normal" lay-event="hy">还原</a>
    <@shiro.hasPermission name="mgr:view">
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail" style="margin-left: 0px;">查看项目详情</a>
    </@shiro.hasPermission>
</script>
<script type="text/javascript">
    var layer;
    var form = layui.form;
    var table = null;
    var tableIns = null;
    document.onkeydown = function (e) { // 回车提交表单
        var theEvent = window.event || e;
        var code = theEvent.keyCode || theEvent.which;
        if (code == 13) {
            $(".select .select-on").click();
        }
    }
    //注意进度条依赖 element 模块，否则无法进行正常渲染和功能性操作
    var element = "";
    layui.use('element', function () {
        element = layui.element;
    });

    layui.use('table', function () {
        table = layui.table;
        element = element;
        //方法级渲染
        tableIns = table.render({
            id: 'projectList',
            elem: '#projectList',
            url: '/supervisor/projectManager/showProjectListHs',
            cols: [[
                {checkbox: true, fixed: true, width: '5%'},
                {
                    field: 'status', title: '项目状态', width: '10%', templet: function (d) {

                        if (d.status == "000") {
                            return '<span class="pro_status" style="background-color:#8d0517;">已删除 </span>'
                        }
                        if (d.status == "001") {
                            return '<span class="pro_status" style="background-color:#aa9898;">未提交</span>'
                        }
                        if (d.status == "002") {
                            return '<span class="pro_status" style="background-color:#928c8c;">未启动</span>'
                        }
                        if (d.status == "004") {
                            return '<span class="pro_status" style="background-color:#569e20;">进行中</span>'
                        }
                        if (d.status == "003") {
                            return '<span class="pro_status" style="background-color:#2161e3;">已完成</span>'
                        }
                        if (d.status == "005") {
                            return '<span class="pro_status" style="background-color:#E80C0C;">已延期</span>'
                        }
                    }
                },
                {
                    title: '序号', width: '10%', templet: function (res) {
                        return res.LAY_INDEX;
                    }
                },
                {field: 'projectName', title: '项目名称', width: '20%', sort: true},
                {
                    field: 'progress', title: '项目进度', width: '30%', templet: function (d) {
                        return '<div class="layui-progress layui-progress-big" lay-showpercent="true">' +
                            '<div class="layui-progress-bar" lay-percent="' + d.progress + '%"></div>' +
                            '</div>';
                    }
                },
                {field: 'remark', title: '操作', width: '25%', toolbar: "#toolBar"}
            ]],
            page: true,
            height: 'full-110',
            done: function (res, currentCount) {
                //***重点***：table渲染完成后渲染element进度条
                element.render()
            }
        });

        //监听表格复选框选择
        table.on('checkbox(project)', function (obj) {
            //console.log(obj)
        });
        //监听工具条
        table.on('tool(project)', function (obj) {
            var data = obj.data;
            if (obj.event === 'hy') {
                layer.confirm('真的要恢复吗？', function (index) {
                    index = layer.load(1, {shade: [0.1, '#fff']});
                    layerAjax("doHs",{ids: data.id},'',function (d) {
                        if (d.msg) {
                            layer.msg("操作成功", {icon: 1});
                            tableIns.reload();
                        } else {
                            layer.msg("操作失败", {icon: 2});
                        }
                    })

                    layer.close(index);
                });
            }else if(obj.event === 'detail'){
                    window.parent._showtab('xm_v' + data.id, '查看-' + data.projectName, '/supervisor/projectManager/projectDetail?type=v&id=' + data.id);
            }
        });
    });

    function delAll() {
        layer.confirm('确定删除全部？删除之后将无法恢复！！！', function (index) {
            layerAjax('delallprjfromrecycle', {ids: ""}, '', function (d) {
                if (d.flag) {
                    var  data=d.data;
                    layer.msg("操作成功", {icon: 1});
                    for (var i = 0; i <data.length; i++) {
                        var mid=data[i];
                        var tab="xm_e"+mid;
                        window.parent._delTab(tab);
                    }
                    tableIns.reload();
                } else {
                    layer.msg(d.msg, {icon: 2});
                }
            })
        });
    }

    function batchDel() {
        var checkStatus = table.checkStatus('projectList');
        //获取选中数量
        var selectCount = checkStatus.data.length;
        if (selectCount > 0) {
            layer.confirm('确定将选择的项目彻底删除？删除之后将无法恢复！！！', function (index) {
                var ids = [];
                for (var i = 0; i < selectCount; i++) {
                    ids.push(checkStatus.data[i].id);
                }
                layerAjax('delprjfromrecycle', {ids: ids}, '', function (d) {
                    if (d.flag) {
                        layer.msg("操作成功", {icon: 1});
                        for (var i = 0; i <ids.length; i++) {
                            var mid=ids[i];
                            var tab="xm_e"+mid;
                            window.parent._delTab(tab);
                        }
                        tableIns.reload();
                    } else {
                        layer.msg(d.msg, {icon: 2});
                    }
                })
            });
        } else {
            layer.msg('请选择您要删除的项目。', {icon: 2});
        }

    }
</script>

</body>

</html>
